<!-- html结构 -->
<template>
  <!-- 组件中必须有根元素 -->
  <div>
    一号组件
    <!-- <p>{{msg }}</p>
    <p>{{ text }}</p>
    <button @click="setdata">子传父</button> -->
    <!-- <p>作用域插槽传递:<slot :user="userlist"></slot></p> -->
    <!-- <p>匿名插槽:<slot></slot></p>
    <p>具名插槽:<slot name="icon"></slot></p>
    <p>具名插槽:<slot name="footer"></slot></p>
     -->
    <!-- <slot name="log" :user="userlist"></slot> -->
  </div>
</template>
<!-- 存放js -->
<script>
export default {
  props: ['text'],
  data () {
    return {
      msg: '我是list子组件',
      userlist: {
        name: '张三',
        age: 15
      }
    }
  },
  methods: {
    setdata () {
      this.$emit('getmsg', '子组件传过来的值')
    }
  },
  mounted () {
    this.$bus.$on('updata', (e) => {
      console.log(e, 'list组件')
    })
  }
}

</script>
<!-- 存放样式 -->
<!-- scoped :只对当前组件样式生效，不会影响其他组件 -->
<style scoped>
p{
    color: red;
}
</style>
